<template>
  <div>
    <h1>个人简介</h1>
    <div>姓名:{{name}}</div>
    <div>年龄:{{ age }}</div>
    <div>职业:{{ job}}</div>
    <div>简介:{{ getUserInfo }}</div>
    <button @click="modifyUserInfo('灭绝师太',60,'峨嵋派掌门')">修改个人信息</button>
    <button @click="resetUserInfo">重置</button>
    <button @click="patchUserInfo">patch修改</button>
  </div>
</template>

<script lang='ts' setup>

import useUserStore from '@/store/userStore';
import {storeToRefs} from 'pinia'

const store=useUserStore()
const {modifyUserInfo}=store
const {name,age,job,getUserInfo}=storeToRefs(store)
const resetUserInfo=()=>{
    store.$reset()
}
const patchUserInfo=()=>{
    store.$patch({
        name:'周芷若',
        age:23
    })
}
</script>

<style lang='scss' scoped>
</style>